<#import "/spring.ftl" as spring />

<head>
	<title>iGoal.vn | Happy new year | Goals into actions | Chia sẻ mục tiêu của bạn</title>
	<link href="${rc.contextPath}/styles/newyear2011.css" rel="stylesheet" type="text/css">
	<script type="text/javacsript" src="${rc.contextPath}/script/jquery.easing.1.3.js"></script>
	<script type="text/javascript">
		jQuery(document).ready(function(){
			jQuery("#endStep1").click(function(){
				var $goal = jQuery("#data_goal");
				if($goal.val() == 'TÔI MUỐN:'){
					$goal.focus();
					return;
				}
				$(".step1").hide();
				$(".step2").show();
			});
			
			jQuery("#endStep2").click(function(){
				UserManagerExt.isLogined(function(data){
					$(".step2").hide();
					if(data == true){						
						$(".step3").show();
						setTimeout(submitForm, 5000);
					}else{
						$("#success").hide();
						$("#registerForm").show();
						$(".step3").show();						
					}
				});				
			});
			
			jQuery("#showLoginForm").click(function(){
				showLoginForm();
			});
			
			jQuery("#showRegisterForm").click(function(){
				showRegForm();			
			});
			
			jQuery("#data_goal").focus(function(){
				if(jQuery.trim(this.value) == 'TÔI MUỐN:'){
					this.value = '';
				}
			}).blur(function(){
				if(jQuery.trim(this.value) == ''){
					this.value = 'TÔI MUỐN:';
				}
			});
			
			jQuery("#login_link").click(function(){
				submitAfterLogin = true;
				var un = jQuery("#username_login").val();
				var pw = jQuery("#password_login").val();
				login(un, pw);
			});
			
			jQuery("#reg_link").click(function(){
				submitAfterLogin = true;
				var un = jQuery("#username_reg").val();
				var pw = jQuery("#password_reg").val();
				var em = jQuery("#email_reg").val();
				var user = {
					username : un,
					email : em,
					password : pw,
					day : 1,
					month : 1,
					year : 1990
				}
				UserManagerExt.register(user, {
					callback : function(result) {
						if (result > 0){
							login(user.username, user.password);
						} else {
							alert("Đăng ký không thành công");
						}
					},
					errorHandler : function(errorString, exception) {
						alert("Có lỗi phát sinh trong quá trình đăng ký");
					}
				});
			});
			
			jQuery("input[type=text]").keypress(function(e){
				if(e.keycode == 13 || e.which == 13) {return false;}
				return true;
			});
		});
		
		var submitAfterLogin = false;
		
		function submitForm(){					
			jQuery("#newyear").submit();
		}
			
		function afterLoggedIn(){
			jQuery(".loader").hide();
			if(!submitAfterLogin){
				jQuery(".menuTop").html('<a href="/igoal.vn" target="_blank" title="iGoal.vn | Goals into actions">TRANG CHỦ IGOAL</a>');
			}else{				
				showSuccessMessage();
				submitForm();
			}
		}
		
		function loginFailed(){
			jQuery(".loader").hide();
		}
		
		function showLoginForm(){
			$("#registerForm").hide();
			$("#loginForm").show();
			$("#registerMessage").show();
			$("#loginMessage").hide();
		}
		
		function showRegForm(){
			$("#loginForm").hide();
			$("#registerForm").show();
			$("#registerMessage").hide();
			$("#loginMessage").show();	
		}
		
		function showSuccessMessage(){
			$("#success").show();
			$("#registerForm").hide();
			$("#loginForm").hide();
		}
	</script>
</head>
<body>
	<div class="container">
    	<div class="menuTop">
        	<a href="/?step1=1" target="_blank" title="iGoal.vn | Goals into actions">TRANG CHỦ IGOAL</a><#if !data.userInSession??> | <a href="/?step2=1" title="iGoal.vn | Goals into actions">ĐĂNG KÝ</a> | <a href="#login_dialog" id="btn_login" title="iGoal.vn | Goals into actions">ĐĂNG NHẬP</a></#if>
        </div>
        <form id="newyear" name="data" action="${rc.contextPath}/cp/newyear2011.html" method="POST">
        <!------ ========== Step 1 ==========-->
        <div class="blueBox step1">
        	<span class="t2011 bgPos"></span>
        	<h1>MỤC TIÊU CỦA BẠN TRONG NĂM </h1>
            <p>
            	iGoal.vn là cộng đồng chia sẻ mục tiêu, gắn kết những người có chung định hướng để cùng nhau thực hiện mục tiêu đó. Trước thềm năm mới 2011, hãy cùng iGoal chia sẻ mục tiêu của bạn nhé!
            </p>
            <div class="clearthis"></div>
            <div class="formAddGoal">
            	<input type="text" class="formInput" name="goal" id="data_goal" value="TÔI MUỐN:"><a href="#" id="endStep1" title="Tiếp Tục" class="next bgPos"></a>
            </div>
             <div class="clearthis"></div>
            <p class="exampleT">Ví dụ: <a href="#">học guitar</a>, <a href="#">tốt nghiệp đại học</a>, <a href="#">có bạn gái</a>...</p>
        </div>
        
        <!------ ========== Step 1 ==========-->

        <div class="blueBox step2" style="display:none">
        	<span class="bgPos goalintoaction"></span>
        
            <div class="formAddGoal">
            	<label>Nhắc nhở thực hiện:</label><select name="subscriptionType"><option value="2">Hàng tháng</option><option value="3">3 tháng một lần</option><option value="4">6 tháng một lần</option></select>
                <label>Nhận động viên từ iGoal:</label><input name="receive" checked="checked" type="radio"/><label>Có</label><input name="receive" type="radio"/><label>Không</label><a href="#" id="endStep2" title="Tiếp Tục" class="next bgPos"></a>
            </div>
             <div class="clearthis"></div>
            <p class="exampleT">iGoal sẽ gửi những bài viết chia sẻ về kinh nghiệm sống, những bài viết về cách thực hiện mục tiêu nếu bạn đồng ý nhận email từ chúng tôi</p>
        </div>
        <!------ ========== Step 1 ==========-->
		</form>
        <div class="blueBox step3" style="display:none;">
        	<span class="bgPos thongtincanhan"></span>
        
            <div class="formAddGoal">
            	<!=== Register =====--->
                <ul id="registerForm" style="display:none">
                	<li style="width:150px">
                    	<label>Tài khoản:</label>
                        <input id="username_reg" type="text" class="formInput"/>
                    </li>
                    <li style="width:150px">
                    	<label>Mật khẩu:</label>
                        <input id="password_reg" type="password" class="formInput"/>
                    </li>
                    <li style="width:200px">
                    	<label>Email:</label>
                        <input id="email_reg" type="text" class="formInput" style="width:200px"/>
                    </li>
                    <li class="loader" style="display: none;">
                    	<img src="${rc.contextPath}/images/loader.gif" />
                    </li>
                    <li>
                    	<a href="#" id="reg_link" title="Tiếp Tục" class="next bgPos"></a>
                    </li>
                </ul>
                <!===================================== Login ====================== -->
                <ul id="loginForm" style="display:none">
                	<li style="width:120px">
                    	<label>&nbsp;</label>
                        
                    </li>
                	<li style="width:150px">
                    	<label>Tài khoản:</label>
                        <input id="username_login"  type ="text" class="formInput"/>
                    </li>
                    <li style="width:150px">
                    	<label>Mật khẩu:</label>
                        <input id="password_login"  type ="password" class="formInput"/>
                    </li>
					<li class="loader" style="display: none;">
                    	<img src="${rc.contextPath}/images/loader.gif" />
                    </li>
                    <li>
                    	<a href="#" id="login_link" title="Tiếp Tục" class="next bgPos"></a>
                    </li>
                </ul>
                <!===================================== Done ====================== -->
                <ul id="success" class="addGoalDone">
                	<li style="width:780px">
                    	<p><em>Hệ thống đang tự động chuyển về trang chủ của iGoal. Vui lòng chờ trong giây lát hoặc click vào link bên dưới</em> </p>
                        <h2><b>Bạn đã thêm mục tiêu của năm thành công</b> Để thêm mục tiêu khác vui lòng về <a href="${rc.contextPath}">trang chủ iGoal</a></h2>
                        
                    </li>
                </ul>
            	
            </div>
            <div class="clearthis"></div>
            <p class="exampleT" id="loginMessage">Nếu bạn đã có tài khoản iGoal, xin vui lòng <a id="showLoginForm" href="#"><b>CLICK ĐÂY</b></a> để <b>ĐĂNG NHẬP</b></p>
            <p class="exampleT" id="registerMessage" style="display: none;">Nếu bạn chưa có tài khoản iGoal, xin vui lòng <a id="showRegisterForm" href="#"><b>CLICK ĐÂY</b></a> để <b>ĐĂNG KÝ</b></p>
        </div>
              
        <div class="clearthis"></div>
        <p class="titleTagCloud"><b>${data.goalCount}</b> MỤC TIÊU CỦA NĂM <b>2011</b> ĐANG ĐƯỢC THỰC HIỆN</p>
        <div class="tagCloud">
        	<#list data.goals as goal>
        		<a href="${rc.contextPath}/goal/view/${goal.id}" target="_blank" class="a${goal.cloudIndex}">${goal.title}</a>
        	</#list>        	
        </div>
    </div>
</body>